<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>form表单</title>
	</head>
	<body>
		<!--
			网络协议：//域名/文件名？参数1=参数1值 & 参数2=参数2值 & 参数3=参数3值
			http://127.0.0.1:8020/20190704html/form.html?uname=&psd=&xb=2
			
		-->
		<!--
			<标签 属性名=属性值 >显示内容</标签>
		-->
		
		<!--
			form
		  	action	指定提交地址
		  	input   输入框
		  	value   储存用户输入的文本
		  	type：
		  		text  文本框
		-->
		<!--
			method 提交方式
			    get提交方式：将所有的参数都拼接到地址栏上,没有安全性可言
			    post提交方式：将数据包装在请求体中（Form Date），信息传输有一定安全性
			    
			    enctype="multipart/form-data" 当用户上传文件（图片，视频，音频），
			    
			    form表单enctype属性值，一定是multipart/form-data
			    
			    autofocus 默认鼠标自动焦距，大部分用于PC端
			    
			    multiple 实现下拉框/上传图片多选
		-->
		<form action="a.php" method="post" enctype="multipart/form-data">
			用户名：<input type="text"   placeholder="请输入用户名" name="uname" autofocus="autofocus"/><br />
			
			密码：<input type="password" placeholder="请输入密码"   name="psd"/><br />
			
			性别：<label><input type="radio" value="0" name="xb" checked="checked"/>男</label>
				  <label><input type="radio" value="1" name="xb"/>女</label>
				  <label><input type="radio" value="2" name="xb"/>保密</label>
				  <br />
			
			爱好：<input type="checkbox" value="sing" name=bobbies[]"/>唱	
				  <input type="checkbox" value="jump" name=bobbies[]" >跳	
				  <input type="checkbox" value="Rap" name=bobbies[]"/>Rap	
				  <input type="checkbox" value="basketball" name=bobbies[]"/>篮球	
				  <br />
			
			地区：<select name="area" multiple="multiple">
			      <option value="" disabled="disabled">请填写地区</option>
			      <option value="0">北京</option>
			      <option value="1">上海</option>
			      <option value="2">广州</option>
			      <option value="3">深圳</option>
			      <option value="4">杭州</option>
				  </select>
				  <br />	  
			
			头像：<input type="file" name="avatar" multiple="multiple"/> <br />
			文本域：
				<textarea name="" rows="20" cols="30" readonly="readonly"
						style="resize: none;"
					>
					服务条款
					服务条款
					服务条款
					服务条款
					服务条款
					
				</textarea>
				  
				  
				  <input type="reset" name="" id="" value="重置" />
				  <input type="submit" name="" id="" value="提交" />
				  <hr />
				  <p>input</p>
				  <input type="button" name="" id="" value="button" /><br />
				  <input type="image" src="img/com.png"/><br />
				  <input type="number" name="" id="" value="" /><br />
				  <input type="date" name="" id="" value="" /><br />
				  <!--滑动组件-->
				  <input type="range" name="" id="" value="100" /><br />
				  <input type="color" name="" id="" value="" /><br />
				  <!--调用前置摄像头-->
				  <input type="file" capture="camcorder"/>
				  <!--摄像头-->
				  <input type="file" capture="camera"/>
				  <!--麦克风-->
				  <input type="file" capture="microphone"/>
		</form>		
	</body>
</html>
